
const gridsModule = {
    state: {
        areaData: {
            style: {
                top: 0,
                left: 0,
                width: 0,
                height: 0,
            },
            components: [],
        },
        canvasStyleData: { // 页面全局数据
            width: 1200,
            height: 740,
            scale: 100,
        },
        // 画布组件数据
        componentData: [],
        curComponent: null,
        curComponentIndex: null,
    },
    mutations: {
        SET_COMPONENT_DATA(state, {mode, value, index}) {
            if(mode === 'push') {
                state.componentData.push(value)
            } else if(mode === 'splice') {
                state.componentData.splice(index, 1)
            }
        },
        SET_CUR_COMPONENT(state, { component, index }) {
            state.curComponent = component
            state.curComponentIndex = index
        },
        SET_CUR_COMPONENT_ATTR(state, data) {
            for (const key in data) {
                state.curComponent[key] = data[key]
            }
        },
        SET_SHAPE_STYLE ({curComponent}, data) {
            curComponent.style = data;
        },
        SET_CUR_COMPONENT_STYLE_ATTR(state, data) {
            for (const key in data) {
                state.curComponent.style[key] = data[key]
            }
        },
        SET_CUR_COMPONENT_CHILDREN(state, {mode, value, index}) {
            if(!state.curComponent.children) {
                state.curComponent.children = []
            }
            if(mode === 'push') {
                state.curComponent.children.push(value)
            } else if(mode === 'splice') {
                state.curComponent.children.splice(index, 1)
            }
        },
        SET_AREA_DATA(state, data) {
            state.areaData = data
        }
    },
    actions: {
        setComponentData ({ commit }, data) {
            commit('SET_COMPONENT_DATA', data)
        },
        setCurComponent ({ commit }, data) {
            commit('SET_CUR_COMPONENT', data)
        },
        setCurComponentAttr ({ commit }, data) {
            commit('SET_CUR_COMPONENT_ATTR', data)
        },
        setShapeStyle ({ commit }, data) {
            commit('SET_SHAPE_STYLE', data)
        },
        setCurComponentStyleAttr ({ commit }, data) {
            commit('SET_CUR_COMPONENT_STYLE_ATTR', data)
        },
        setCurComponentChildren({ commit }, data) {
            commit('SET_CUR_COMPONENT_CHILDREN', data)
        },
        setAreaData({ commit }, data) {
            commit('SET_AREA_DATA', data)
        },
    }
}

export default gridsModule